$ratio: 375 / 10;
$animationTime: .2s;
$animationType: ease-in-out;

@function px2rem($px) {
    @return $px / $ratio + rem;
}

.icon {
    color: #666;
    font-size: px2rem(16);
}

.title {
    color: #666;
    font-size: px2rem(16);
    font-weight: bold;
}

@mixin scroll {
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    &::-webkit-scrollbar {
        display: none;
    }
}

@mixin center {
    display: flex;
    justify-content: center;
    align-items: center;
}

@mixin left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

@mixin right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

@mixin  columnLeft {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

@mixin ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

@mixin ellipsis2($line) {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $line;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: keep-all;
}